<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    		"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html 	xmlns="http://www.w3.org/1999/xhtml"
		xmlns:ui="http://java.sun.com/jsf/facelets"
		xmlns:h="http://java.sun.com/jsf/html"
		xmlns:f="http://java.sun.com/jsf/core"
		xmlns:fn="http://java.sun.com/jsp/jstl/functions"
		xmlns:p="http://primefaces.prime.com.tr/ui">

<h:head>
	<h:title></h:title>
	<style type="text/css" >
		.ui-widget {
		    font-size: 11px !important;
		}
		.ui-selectonemenu {
			top: 5px;
		}
	</style>
	<script type="text/javascript" src="resources/js/jquery.price_format.1.5.js"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			$('.number').priceFormat({prefix: '', centsSeparator: ',', thousandsSeparator: '.', limit: 8, centsLimit: 2});
		});
	</script>
</h:head>
	<h:body>
		<h:form enctype="multipart/form-data">
			<div id="header">
			    <ui:insert name="header">
			    	<ui:include src="/domotic/resources/templates/header.xhtml"/>
			    </ui:insert>
			</div>
			
			<div id="content">
				<p:panel header="Cadastro de Cômodos" style="min-height: 410px;">
				
					<h:panelGrid columns="2">
						<span>Código: </span><p:inputText disabled="true"></p:inputText>
						<span>Andar: </span><p:selectOneMenu title="Nome" maxlength="80" size="60" style="width: 140px;">
							<f:selectItem itemLabel="Select One" itemValue="0"/>
							<f:selectItem itemLabel="Andar 1" itemValue="1" />
							<f:selectItem itemLabel="Andar 2" itemValue="2" />
							<f:selectItem itemLabel="Andar 3" itemValue="3" />
						</p:selectOneMenu>
						<span>Nome: </span><p:inputText title="Nome" maxlength="80" size="60"></p:inputText>
						<span>Área Total: </span><h:panelGroup><p:inputText maxlength="10" styleClass="number"></p:inputText><span> m²</span></h:panelGroup>
						<span>Início: </span>
						<h:panelGroup>
							<span>X </span><p:inputText size="4"></p:inputText>&nbsp;
							<span>Y: </span><p:inputText size="4"></p:inputText>&nbsp;
							<!-- <p:button value="Buscar na planta"></p:button> -->
						</h:panelGroup>
						<span>Fim</span>
						<h:panelGroup>
							<span>X </span><p:inputText size="4"></p:inputText>&nbsp;
							<span>Y: </span><p:inputText size="4"></p:inputText>&nbsp;
							<!-- <p:button value="Buscar na planta"></p:button> -->
						</h:panelGroup>
					</h:panelGrid>
					<div style="min-height: 6px;" />
					<p:button value="Cadastrar"></p:button>
					<p:button value="Alterar" disabled="true"></p:button>
					<p:button value="Excluir" disabled="true"></p:button>
					<div style="min-height: 10px;" />
					<span>Imagem do Andar: </span><br/>
					<p:graphicImage style="border: 1px solid;"/>
					
					
				</p:panel>
				
			</div>
			
			<div id="footer">
			  <ui:insert name="footer">
					<ui:include src="/domotic/resources/templates/footer.xhtml"/>
			  </ui:insert>
			</div>
			<!-- Remove, find a bug when messages displayed -->
			<p:growl id="messages" showDetail="true"/>
		</h:form>
	</h:body>
</html>